import request from '../../utils/request'
// pages/video/video.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    navList: [],
    currentNavId: '',
    videoList: [],
    vid: "",
    recordList: [], //保存视频的播放记录 包含id和time
    flag: false
  },
  // 获取navlist数据
  async getNavList() {
    const result = await request('/video/group/list')

    if (result.code === 200) {
      this.setData({
        navList: result.data.slice(0, 15),
        currentNavId: result.data[0].id
      })
    }
    // 获取navList成功后调用一次
    this.getVideoList()
  },
  // 点击nav切换
  changeNav(e) {
    // console.log(e);
    let currentNavId = e.target.dataset.id * 1
    this.setData({
      currentNavId
    })
    // 点击也要调
    this.getVideoList()
  },
  // 获取视频列表数据
  async getVideoList() {
    const result = await request('/video/group', {
      id: this.data.currentNavId
    })
    if (result.code === 200) {
      this.setData({
        videoList: result.datas.map(item => item.data),
        flag: false
      })
    }
  },
  // 控制视频的播放 单例模式
  palyOrPause(e) {
    this.setData({
      vid: e.target.id
    })
    // 不存在代表第一次点
    if (!this.player) {
      // 不存在就创建新的视频上下文
      this.player = wx.createVideoContext(this.data.vid)
      // 播放
      this.player.play()
      // 存储视频id 用于下一次点击的时候判断是不是点的同一个
      this.vid = this.data.vid
      // 保存视频的播放状态用于判断下一次点的是同一个的时候，播放状态如何设置
      this.isPlay = true
    } else {
      // 非第一次
      // 判断点的是不是同一个视频
      if (this.data.vid === this.vid) {
        // 点的是同一个视频
        if (this.isPlay) {
          // 之前状态正在播放
          // 暂停
          this.player.pause()
          // 更改状态
          this.isPlay = false
        } else {
          // 之前状态暂停
          // 播放
          this.player.play()
          // 更改状态
          this.isPlay = true
        }
      } else {
        // 点的是不同的视频
        // 暂停上一个
        this.player.pause()
        //创建新的视频上下文，覆盖上一次 保证只有一个视频上下文
        this.player = wx.createVideoContext(this.data.vid)

        // 查看是否有当前视频的播放记录 有的话需要把时间指定跳转
        let obj = this.data.recordList.find(item => item.vid === this.data.vid)
        // 存在播放记录 要跳转
        obj && this.player.seek(obj.currentTime)
        this.player.play()
        this.vid = this.data.vid
        this.isPlay = true
      }
    }
  },
  // 保存播放进度和id
  handlerTimeUpdate(e) {
    // 判断是否存在当前这个视频的记录
    let recordList = this.data.recordList
    let obj = recordList.find(item => item.vid === this.data.vid)
    if (obj) {
      // 存在则只需要修改当前记录的时间
      obj.currentTime = e.detail.currentTime
    } else {
      // 不存在就创建新的记录对象添加到数据
      obj = {
        vid: this.data.vid,
        currentTime: e.detail.currentTime
      }
      recordList.push(obj)
      this.setData({
        recordList
      })
    }
  },
  // 视频播放结束后删除当前视频的记录
  handlerEnd(e) {
    let recordList = this.data.recordList
    let index = recordList.findIndex(item => item.vid === this.data.vid)
    index !== -1 && recordList.splice(index, 1)
    this.setData({
      recordList
    })

  },
  // 下拉刷新
  handlerRefresh() {
    // 开启三个点
    this.setData({
      flag: true
    })
    // 重新发请求获取视频列表
     this.getVideoList()
  },
  // 上拉触底后再懒加载数据
  handlerScrolltolower(){
    let videoList = this.data.videoList
    let newArr = videoList.concat(videoList)
    if(newArr.length <= 40){
      this.setData({
        videoList:newArr
      })
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getNavList()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function ({from}) {
    if(from==='button'){
      // 点的是页面的按钮
      return{
        title:'快点爬',
        path:'/pages/video/video',
        imageUrl:'../../static/images/虫.jpg'
      }
    }
    
  }
})